<template>
    <view class="container">
      <view class="doctor-list-wrapper">
        <view class="doctor-info" v-for="(doctor, index) in dataList" :key="index">
          <view class="doctor-left">
            <image class="doctor-avatar" :src="doctor.evaluationImg" mode="aspectFill" @click="tz(doctor)"></image>
          </view>
          <view class="doctor-right">
            <view class="doctor-detail">
              <text class="doctor-name">{{ doctor.name }}</text>
              <view class="doctor-meta">
                <text class="doctor-title" style="color: red;">{{ doctor.evaluationDescribe }}</text>
              </view>

              <view>
                <text class="doctor-specialty">{{ doctor.evaluationCount }}人参与</text>
              </view>

            </view>
          </view>
          <!--          <view>-->
          <!--            擅长: <text class="doctor-bio">{{ doctor.bio }}</text>-->
          <!--          </view>-->
        </view>

      </view>
    </view>
</template>

<script>
import {selectEvaluation} from "@/api/doctor/doctor";

export default {
  data() {
    return {
      dataList:[],
      queryParam: {
        name:null,
        evaluationImg:null,
        evaluationDescribe:null,
        evaluationCount:null,
      },

    };
  },

  onLoad() {
    this.getEvaluation();
  },
  methods: {

    getEvaluation(){
      this.loading = true;
      selectEvaluation(this.queryParam).then(response => {
        this.dataList = response.data;

      });
    },
    tz(item) {
      let id = item.id;
      uni.navigateTo({
        url: `/pages/ai/question?id=${id}`
      })
    },





  },

};
</script>

<style scoped>

/* 医生列表容器样式 */
.doctor-list-wrapper {
  display: flex;
  flex-direction: column;
  background-color: #f9f9f9;
  padding: 3px;
  border-radius: 8px;
}

/* 医生信息块样式 */
.doctor-info {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  background-color: #ffffff;
  padding: 15px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
}

/* 头像左侧容器样式 */
.doctor-left {
  flex: 0 0 100px; /* 固定宽度为100px */
  margin-right: 15px;
}

/* 头像样式 */
.doctor-avatar {
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

/* 文字信息右侧容器样式 */
.doctor-right {
  flex: 1; /* 占据剩余空间 */
  display: flex;
  flex-direction: column;
  justify-content: center; /* 垂直居中 */
}

/* 医生详细信息样式 */
.doctor-detail {
  width: 100%;
}

/* 医生姓名样式 */
.doctor-name {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
}

/* 医生元信息样式（医院名称和科室） */
.doctor-meta {
  margin-bottom: 15px;
}

.doctor-title {
  font-size: 16px;
  color: red;
  margin-bottom: 5px;
}

.doctor-specialty {
  font-size: 14px;
  color: #555555;
}

/* 医生医院信息样式 */
.doctor-hospital-info {
  width: 100%;
}

.doctor-hospital {
  font-size: 16px;
  margin-bottom: 5px;
}

.hospital-level {
  font-size: 14px;
  color: #333333;
  margin-top: 2px;
}





</style>
